<template>
  <div>
     头部组件
     {{newText}}
     <div v-for="role in roles" :key="role.role_id">
        <p>{{role.roleName}}</p>
        <img :src="role.roleThumbnail" alt="">
        {{getMessage}}
     </div>
  </div>
</template>
<script>
export default{
    name:"Head",
    data(){
      return{
        roles:[],
        message:'hello.vue'
      }
    },
    props:{
      newText:String
    },
    //生命周期
    created() {
      this.ajax({
        method:'get',
        url:"/mydata/roles/role-info.php?goodsID=12",
      }).then((res)=>{
        this.roles=res.data;
      }).catch((error)=>{
        console.log('失败'+error)
      })
    },
    computed:{
        getMessage(){
          return this.message.split('').reverse().join("")
        }
    }
}
</script>